<template>
  <div class="mocks-read-main">
    <div class="read-left">
      <div class="rl-inner">
        <h3 class="rl-title">{{partInfo.title}}</h3>
        <div class="rl-arti" v-html="articleText"></div>
      </div>
    </div>
    <div class="read-right">
      <tuozhuai ref="tuozhuai" :title="partInfo.describe" :question="questionInfo"></tuozhuai>
    </div>
  </div>
</template>

<script>
  import Tuozhuai from '../components/tuozhuai/index';

  export default {
    name: "MocksRead",
    componentType: 'paperPartQuestion',
    components: { Tuozhuai },
    props: {
      partInfo: Object
    },
    computed: {
      questionInfo () {
        return this.partInfo && this.partInfo.question_list ? this.partInfo.question_list[0] : null;
      },
      articleText () {
        let str = this.partInfo.content;
        return (str && typeof str === 'string') ? str.replace(/\n/g, '<br />').replace(/\t/g, '&nbsp;') : '';
      }
    },
    methods: {
      checkUserAnswer () {
        let $tuozhuai = this.$refs['tuozhuai'];
        if ($tuozhuai) {
          return $tuozhuai.checkUserAnswer();
        }
        return false;
      },
      getPartAnswer () {
        let res = [];
        let $tuozhuai = this.$refs['tuozhuai'];
        // debugger
        if ($tuozhuai) {
          let answer = $tuozhuai.getAnswer();
          res.push(answer);
        }
        return res;
      }
    }
  }
</script>
